<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>申报页面</title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css">
    <script src="${pageContext.request.contextPath}/js/jquery-3.6.0.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
    <!-- Bootstrap -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.css"/>
    <%--引入echarts--%>
    <script src="${pageContext.request.contextPath}/js/echarts.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/index.css">
</head>
<style type="text/css">
    form {
        margin-top: 20px;
        background-color: #cbe4ff;
        border-radius: 10px;
        padding: 60px;
    }

    form > div {
        width: 700px;
    }

    form > div > div > select {
        height: 33px;
    }

    form > div > label {
        margin-left: 30px;
        width: 200px;
    }

    #code {
        font-family: Arial;
        font-style: italic;
        font-weight: bold;
        border: 0;
        letter-spacing: 2px;
        color: blue;
    }

    .addcon {
        background: url("../../../img/index/Frame 11.png") no-repeat;
        height: 10%;
        background-size: 100%;
    }

    .addcon a {
        font-size: 18px;
    }

    .addcon .iconfont {
        font-size: 24px;
    }
</style>
<body>
<div class="">
    <%@ include file="../pub/header.jsp" %>
    <div class="header">
        <div class="nav">
            <div class="container">
                <div class="row w">
                    <span class="col-md-2"></span>
                    <a class="col-md-2 col-xs-4" href="${pageContext.request.contextPath}/index">
                        <h1
                            style="font-size: 22px;color: whitesmoke">首页
                        </h1>
                    </a>
                   <span class="col-md-4" style="margin-left: 10%">
                       <h1 style="font-size: 22px;color: whitesmoke">项目申报资料填写</h1>
                   </span>
                    <a class="col-md-1 col-xs-4" href="javaScript:history.back(-1)">
                        <h1
                                style="font-size: 22px;color: whitesmoke">返回
                        </h1>
                    </a>
                    <span class="col-md-2"></span>
                </div>
            </div>
        </div>
    </div>
    <div style="margin-top: 100px;width: 800px;margin: auto;">
        <div style="text-align: center;width: 100%;margin: auto">

        </div>
        <form class="form-horizontal" role="form" enctype="multipart/form-data" method="post">
            <div class="form-group">
                <label class="col-sm-3 control-label" for="userName">
                    姓名:
                </label>
                <div class="col-sm-7">
                    <input class="form-control" id="userName" name="userName" type="text" value="${userInfo.name}"
                           readonly>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-3 control-label" for="idCard">
                    身份证号:
                </label>
                <div class="col-sm-7">
                    <input class="form-control" id="idCard" name="idCard" type="text" value="${userInfo.idCard}"
                           readonly>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="sex">
                    性别:
                </label>
                <div class="col-sm-7">
                    <input class="form-control" id="sex" name="sex" type="text" value="${userInfo.sex}" readonly>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="email">
                    电话:
                </label>
                <div class="col-sm-7">
                    <input class="form-control" id="email" value="${userInfo.telephone}" readonly>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="address">
                    地址:
                </label>
                <div class="col-sm-7">
                    <input class="form-control" id="address" name="address" type="text"
                           value="${userInfo.address}" readonly>
                </div>
            </div>

            <hr style="border-color: #2b2b2b">
            <div class="form-group" style="display: none">
                <div class="col-sm-7">
                    <input class="form-control" id="itemId" type="text" value="${itemInfo.item.id}" readonly>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="passWord">
                    事项名称：
                </label>
                <div class="col-sm-7">
                    <input class="form-control" id="passWord" type="text" value="${itemInfo.item.name}" readonly>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="tell">
                    事项类型:
                </label>
                <div class="col-sm-7">
                    <input class="form-control" id="tell" type="text" value="${itemInfo.matterType}" readonly>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="t">
                    服务类型:
                </label>
                <div class="col-sm-7">
                    <input class="form-control" id="t" type="text" value="${itemInfo.serverType}" readonly>
                </div>
            </div>

            <hr style="border-color: #2b2b2b">
            <div class="form-group">
                <label class="col-sm-3 control-label" for="t">
                    办事人员:
                </label>
                <div class="col-sm-7"  id="fukusyaNendo">
                    <select class="form-control">
                        <c:forEach items="${itemUser}" var="it"><option value="${it.id}">${it.name}</option></c:forEach>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="mater">
                    <i class="iconfont" style="color: red;font-size: 8px;margin-right: 5px">&#xe6fb;</i>材料提交:
                </label>
                <div class="col-sm-7">
                    <input class="form-control" id="mater" type="text" value="">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="thumbnail-btn">
                    <i class="iconfont" style="color: red;font-size: 8px;margin-right: 5px">&#xe6fb;</i>选择文件:
                </label>
                <div class="col-sm-7">
                    <input name="file" value="" id="file" style="display: none" placeholder="尽量提交完整材料压缩包">
                    <input name="" id="thumbnail-btn" type="file">
                </div>
                <img id="src" src="" width="100">
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label" for="remarks">
                    备注:
                </label>
                <div class="col-sm-7">
                    <textarea rows="3" id="remarks" cols="51"></textarea>
                </div>
            </div>

            <div class="form-group">
                <div class="col-sm-2 col-xs-2">
                    <input class="form-control" type="button" value="申报" onclick="submitForm()"
                           style="background-color: #1a3eb4;color: white;margin-left: 280px">
                </div>
            </div>
        </form>
    </div>

    <%@include file="../pub/footer.jsp" %>
</div>
<script>
    // js代码部分 图片上传,一脸懵逼
    $(function () {
        var thumbnailBtn = $('#thumbnail-btn');
        thumbnailBtn.change(function () {
            var file = thumbnailBtn[0].files[0];
            var csrf_value = $("[name='csrfmiddlewaretoken']").val();
            var formData = new FormData();
            formData.append('file', file);
            formData.append('csrfmiddlewaretoken', csrf_value);
            $.ajax({
                url: '/fileUp',
                type: 'post',
                data: formData,
                processData: false,
                contentType: false,
                success: function (result) {
                    console.log(result)
                    $("#file").attr("value",result)
                    // $("#src").attr("src",result)
                    // if(result['code']===200){
                    //     console.log(result['data']);
                    //     var url = result['data']['url'];
                    //     var thumbnailInput = $('#thumbnail-form');
                    //     thumbnailInput.val(url)
                    // }
                }
            })
        })
    });


    function submitForm() {
        var options=$("#fukusyaNendo option:selected");
        var item_userId = options.val();
        // alert("已提交申报，请等候审批！");
        let mater = $("#mater").val();
        let message = $("#passWord").val();
        let itemId = $("#itemId").val();
        let remarks = $("#remarks").val();
        let fil = $("#file").val();
        $.post("/re_approve/addDeclare",{
            'materialContext': mater,
            'message': message,
            'itemId': itemId,
            'remark': remarks,
            'itemUserid': item_userId,
            'materialFilePath': fil
        },function (res) {
            if (res == '1') {
                window.location.href = "${pageContext.request.contextPath}/index"
            }
        })
    }

</script>
</body>
</html>